.introBanner {
  	background: url(/images/intro/about_us_banner.png) no-repeat 100%/cover;
	width: 100%;
	height: 420px;
}
.companyOverviewBox {
	padding: 70px 0;
	font-size: 16px;
	font-weight: 500;
	line-height: 38px;
	.companyImage {
		overflow: hidden;
		width: 540px;

		img {
			float: left;
			margin-left: 60px;
			height:300px;
		}

	}
	.companyBriefInfo {
		width: 770px;
		font-size: 16px;
		font-weight: 400;
		color: rgba(0, 0, 0, 0.5);
		p {
			line-height: 38px;
		}
	}
}
.historyBox {
	padding: 70px 0 100px;
	.mainContent {
		width: 100%;
		height: 640px;
		border-radius: 10px;
		position: relative;
	}
	.mainContent::before{
		position: absolute;
		content: '';
		width: 100%;
		height: 100%;
		background: linear-gradient(90deg, rgba(11, 106, 198, 0) 0%, #0B6AC6 92.68%);
		position: absolute;
		left: 0;
		top: 0;
		z-index: 10;
	}
	.boxTitle {
		width: 1400px;
		text-align: left;
	}
	.historyContent {
		position: absolute;
		z-index: 100;
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		height: 100%;
		.historyLeft {
			display: flex;
		}
		.historyYear {
			width: 540px;
			height: 200px;
			position: relative;
			top: -20px;
			.historyYearBg {
				width: 540px;
				height: 134px;
			}
			.historyYearText {
				width: 200px;
				height: 200px;
				background: rgba(255, 255, 255, 0.2);
				border-radius: 50%;
				font-size: 38px;
				font-weight: 400;
				line-height: 200px;
				text-align: center;
				color: #fff;
				position: absolute;
				left: 180px;
				top: 20px;
			}
		}
		.historyYear::after {
			content: '';
			width: 12px;
			height: 12px;
			border-radius: 50%;
			background: #fff;
			position: absolute;
			right: 0;
			top: 94px;
			display: none;
		}
		.dev-swiper {
			width: 500px;
			height: 200px;
			overflow: hidden;
			padding-left: 23px;
			.swiper-slide {
				display: flex;
				flex-direction: column;
				justify-content: center;
			}
			.dev-swiper-text {
				font-size: 24px;
				font-weight: 400;
				line-height: 32px;
				color: #fff;
				letter-spacing: -1px;
			}
		}
		.dev-swiper-action {
			.dev-swiper-pagination {
				width: 160px;
				height: 366px;
				flex-direction: column;
				cursor: pointer;
				.dev-swiper-pagination-item {
					position: relative;
					width: 100%;
					height: 30px;
					font-size: 16px;
					font-weight: 400;
					line-height: 30px;
					color: rgba(255, 255, 255, 0.5);
				}
				.dev-swiper-pagination-item::after {
					content: '';
					position: absolute;
					right: 0;
					top: 13px;
					width: 50px;
					height: 2px;
					background: rgba(255, 255, 255, 0.5);
					transition: all 0.375s linear;
				}
				.dev-swiper-pagination-item.active {
					color: #fff;
				}
				.dev-swiper-pagination-item.active::after {
					width: 100px;
					background: rgba(255, 255, 255, 1);
				}
			}
			.dev-swiper-button {
				position: absolute;
				bottom: 40px;
				right: 40px;
				width: 104px;
				img {
					width: 32px;
					height: 32px;
					cursor: pointer;
				}
			}
		}
		
		
	}
}
